<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="Keywords" content="">
    <meta name="description" content="">
    <title> 商品规格 </title>
    <link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/dpl.css" rel="stylesheet">
    <link href="http://g.alicdn.com/bui/bui/1.1.21/css/bs3/bui.css" rel="stylesheet">
    <link href="http://www.builive.com/apps/default/assets/css/main.css" rel="stylesheet" type="text/css" />
    <link href="css/global.css" rel="stylesheet">
</head>
<body>
    <div class="ws-goodstyle">
        <p class="ws-goodstyle__tit">
            <span>商品规格</span>点击选择当前商品需要的规格。
        </p>
        <div class="ws-goodstyle__sec">
            <ul class="ws-goodstyle__tab" data-role="style-tab">
                <li class="is-active" data-value='' data-id='' data-spec-id=2><i>颜色</i>(<span>0</span>)</li>
                <li data-value='' data-id='' data-spec-id=9><i>尺码</i>(<span>0</span>)</li>
            </ul>
            <ul class="ws-goodstyle__result" data-role="style-result">
                <li class="is-active">
                    <div class="ws-goodstyle__selectAll">
                        <label for="selectAll1">
                            <input type="checkbox" data-role="selectall" id="selectAll1"> 全选
                        </label>
                    </div>
                    <ul class="ws-goodstyle__item" data-role="goodstyleitem0">
                        <li>
                            <input type="checkbox" id="s1" title="黑色" value="黑色" data-id=1>
                            <label for="s1">
                                <span class="spec-name">黑色</span>
                            </label>
                        </li>
                        <li>
                            <input type="checkbox" id="s2" title="黄色" value="黄色" data-id=2>
                            <label for="s2">
                                <span class="spec-name">黄色</span>
                            </label>
                        </li>
                        <li>
                            <input type="checkbox" id="s3" title="红色" value="红色" data-id=3>
                            <label for="s3">
                                <span class="spec-name">红色</span>
                            </label>
                        </li>
                        <li>
                            <input type="checkbox" id="s4" title="绿色" value="绿色" data-id=4>
                            <label for="s4">
                                <span class="spec-name">绿色</span>
                            </label>
                        </li>

                    </ul>
                    <div class="spec-img">
                        <table class="gridlist" data-role="gridstyle">
                            <thead>
                                <tr>
                                    <th>规格</th>
                                    <th>关联商品图片</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                          </table>
                    </div>
                </li>
                <li>
                    <div class="ws-goodstyle__selectAll">
                        <label for="selectAll2">
                            <input type="checkbox" data-role="selectall" id="selectAll2"> 全选
                        </label>
                    </div>
                    <ul class="ws-goodstyle__item" data-role="goodstyleitem1">
                        <li>
                            <input type="checkbox" id="d1" title="12" value="12" data-id=6>
                            <label for="d1">
                                <span class="spec-name">12</span>
                            </label>
                        </li>
                        <li>
                            <input type="checkbox" id="d2" title="13" value="13" data-id=7>
                            <label for="d2">
                                <span class="spec-name">13</span>
                            </label>
                        </li>
                        <li>
                            <input type="checkbox" id="d3" title="14" value="14" data-id=8>
                            <label for="d3">
                                <span class="spec-name">14</span>
                            </label>
                        </li>

                    </ul>
                    <div class="spec-img">
                        <table class="gridlist" data-role="gridstyle">
                            <thead>
                                <tr>
                                    <th>规格</th>
                                    <th>关联商品图片</th>
                                </tr>
                            </thead>
                            <tbody>
                                </tbody>
                          </table>
                    </div>
                </li>
            </ul>
        </div>
        <div class="button button-primary ws-goodstyle__pro" data-role="generate">
            生成所有商品
        </div>
        <div class="ws-goodstyle__tableTit">
            共<span>0</span>件商品
        </div>
        <div class="spec-tree">
            <table cellspacing="0" cellpadding="0" border="0" class="gridlist">
                <thead>
                  <tr>
                    <th>规格值</th>
                    <th style="width:auto;">货号</th>
                    <th style="width:4%;">上架</th>
                    <th style="width:6%;">库存</th>
                    <th style="width:6%;">冻结库存</th>
                    <th style="width:15%;">销售价</th>
                    <th style="width:8%;">成本价</th>
                    <th style="width:8%;">市场价</th>
                    <th style="width:8%;">重量(g)</th>
                    <th style="width:8%;">货位</th>
                    <th style="width:5%;">默认货品</th>
                    <th style="width:4%;">操作</th>
                  </tr>
                </thead>
                <tbody data-role="styleResult">

                </tbody>
            </table>
            <div class="ws-goodstyle__save">
                <span class="button button-primary" data-role="styleSave">
                    保存
                </span>
            </div>
        </div>
        <div id="chooseImg" class="hide">
            <div class="division">
                <div class="division-item">
                    <input type="checkbox" id="q1" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q1"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q2" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q2"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q3" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q3"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q4" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q4"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q5" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q5"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q6" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q6"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q7" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q7"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q8" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q8"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q9" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q9"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q11" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q11"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q111" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q111"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
                <div class="division-item">
                    <input type="checkbox" id="q22" imgsrc="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w">
                    <label for="q22"><img src="http://static.chijiayd.com/public/images/0a/28/c5/b1cdcdf59ee94e56770e78b9478132de.jpg?1476759216#w" width="80" height="80"></label>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="http://www.builive.com/apps/default/assets/js/jquery-1.8.1.min.js"></script>
    <script type="text/javascript" src="http://www.builive.com/apps/default/assets/js/bui-min.js"></script>
    <script type="text/javascript" src="http://www.builive.com/apps/default/assets/js/config-min.js"></script>
    <script type="text/javascript" src="./js/goodsStyle.js"></script>
</body>

</html>
